<%-- 
    Document   : basket
    Created on : 2021-6-20, 2:50:02
    Author     : 李东阳
--%>


<%@page import="java.util.List"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>JSP Page</title>
        <link rel="stylesheet" href="css/bootstrap.css" >
       <link rel="stylesheet" href="css/home_css.css"/>
        <link rel="stylesheet" href="https://unpkg.com/bootstrap-table@1.15.3/dist/bootstrap-table.min.css">
        <script type="text/javascript" src="js/jquery-3.4.1.min.js"></script>
        <script type="text/javascript" src="js/bootstrap.js"></script>
        <script src="https://unpkg.com/bootstrap-table@1.15.3/dist/bootstrap-table.min.js"></script>
        <script type="text/javascript" src="js/basketjs.js"></script>
        <script src="js/vue.js" type="text/javascript" charset="utf-8"></script>
        <script src="https://unpkg.com/axios/dist/axios.min.js"></script>

    </head>
    <body>

<%--    vue包裹区--%>
    <div id="app">



        <%--导航栏--%>
        <nav class="main_daohanglan navbar navbar-expand-sm fixed-top navbar-light">


            <!-- Brand/logo -->
            <a class="" href="#">
                <img class="main_touxiang rounded" :src="user.uImg" alt="logo" style="width:60px;">
            </a>
            <h4 class="active">&nbsp;&nbsp;{{user.uName}}</h4>
            <!-- Links -->
            <ul class="navbar-nav ml-auto">

                <li class="nav-item ">
                    <a class="nav-link" href="main.jsp">主页</a>
                </li>
                <li class="nav-item">
                    <a class="nav-link text-dark "  href="#">
                        <div>购物车
                            <svg style="color: #4FC3F7" xmlns="http://www.w3.org/2000/svg" width="30" height="30" fill="currentColor"
                                 class="bi bi-basket2" viewBox="0 0 16 16">
                                <path d="M4 10a1 1 0 0 1 2 0v2a1 1 0 0 1-2 0v-2zm3 0a1 1 0 0 1 2 0v2a1 1 0 0 1-2 0v-2zm3 0a1 1 0 1 1 2 0v2a1 1 0 0 1-2 0v-2z"/>
                                <path d="M5.757 1.071a.5.5 0 0 1 .172.686L3.383 6h9.234L10.07 1.757a.5.5 0 1 1 .858-.514L13.783 6H15.5a.5.5 0 0 1 .5.5v1a.5.5 0 0 1-.5.5h-.623l-1.844 6.456a.75.75 0 0 1-.722.544H3.69a.75.75 0 0 1-.722-.544L1.123 8H.5a.5.5 0 0 1-.5-.5v-1A.5.5 0 0 1 .5 6h1.717L5.07 1.243a.5.5 0 0 1 .686-.172zM2.163 8l1.714 6h8.246l1.714-6H2.163z"/>
                            </svg>
                        </div>
                    </a>
                </li>
            </ul>

        </nav>
        <%--    导航栏结束--%>



<%--表格开始--%>
        <div class="container " style="margin-top: 150px ">
            <%--

表格

            --%>


            <table id="myTable"  >



                <c:forEach items="${sessionScope.carts}" var="b">
                    <tr>
                        <td><img src="img/${b.cid}.jpg" alt="" class="img-rounded" style="height: 250px"></td>
                        <td><p style="font-weight: bold;font-size: 20px">${b.cname}</p></td>
                        <td>${b.cprice}</td>
                        <td>${b.cnum}</td>




                    </tr>
                </c:forEach>




            </table>
        </div>
<%--            表格结束--%>



        <div class="" style="position: absolute;right:350px;font-size: 30px"><b>总价：</b><span id="jiage">   </span></div> <div class="container jiesuan"> <button class="btn btn-danger btn-lg" style="position: absolute;right: 190px">购买</button></div>


<%--下部区开始--%>
        <div class="container" style="margin-top: 60px">
            <div class="row">
                <div class="mod_copyright col-md-12 text-center" >
                    <p class="mod_copyright_links" style="font-size: 11px">
                        关于我们  |  联系我们  |  联系客服  |  商家入驻  |  营销中心  |  鞋品优购  |  友情链接  |  销售联盟  |  品优购社区  |  品优购公益  |  English Site  |  Contact U
                    </p>
                    <p class="mod_copyright_info" style="font-size: 11px">
                        地址：北京市昌平区建材城西路金燕龙办公楼一层 邮编：100096 电话：400-618-4000 传真：010-82935100 邮箱: zhanghj+itcast.cn  <br>
                        京ICP备08001421号京公网安备110108007702
                    </p>

                </div>
            </div>
        </div>
<%--        下部区结束--%>




    </div>
<%--vue包裹区结束--%>



    <script>

        let app = new Vue({
            el:"#app",

            data() {
                return {
                    user: JSON.parse(localStorage.getItem("user")),
                    search:"",

                }
            },



        })


    </script>





                                        </body>
                                        </html>
